<%--
  Created by IntelliJ IDEA.
  User: UP
  Date: 2024/7/29
  Time: 9:36
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<c:set var="contextPath" value="${pageContext.request.contextPath}"/>
<html>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>提现</title>
<style>
    div {
        margin: 20px;
    }

    p {
        font-size: 20px;
        font-weight: bold;
    }

    input[type="text"] {
        padding: 8px;
        margin-left: 10px;
        border: 1px solid #ccc;
        border-radius: 4px;
        box-sizing: border-box;
    }

    button {
        padding: 10px 20px;
        background-color: #007bff;
        color: #fff;
        border: none;
        border-radius: 4px;
        cursor: pointer;
        margin-left: 10px;
    }

    button:hover {
        background-color: #0056b3;
    }

    table {
        width: 90%;
        margin: 20px;
        border-collapse: collapse;
    }

    th, td {
        border: 1px solid #ccc;
        padding: 10px;
        text-align: center;
    }

    th {
        background-color: #f5f5f5;
    }

    #tw {
        text-align: center;
    }

    div:last-child {
        display: flex;
        justify-content: center;
        align-items: center;
        margin: 20px;
    }

    input[type="text"]#page_index {
        width: 50px;
        padding: 8px;
        margin: 0 10px;
        border: 1px solid #ccc;
        border-radius: 4px;
        box-sizing: border-box;
    }
</style>
<body>
<div>
    <p>搜索信息</p>
    提现流水号<input type="text" id="flowNo" name="flowNo">
    提现状态<input type="text" id="status" name="status">
    <button id="" onclick="sel(1)">搜索</button>
</div>

<table>
    <thead>
    <tr>
        <th>编号</th>
        <th>提现流水号</th>
        <th>提现金额</th>
        <th>提现时间</th>
        <th>提现成功时间</th>
        <th>提现用户</th>
        <th>客户联系方式</th>
        <th>到账银行</th>
        <th>银行卡号</th>
        <th>操作</th>
    </tr>
    </thead>
    <tbody id="tw">

    </tbody>

</table>
<div style="display: flex;">
    <button onclick="prevPage()">上一页</button>
    <input id="page_index" type="text">
    <button onclick="nextPage()">下一页</button>
    总页数：<input id="page_total" readonly>
    <button onclick="goPage()">跳转</button>
</div>
</body>
<script src="https://code.jquery.com/jquery-3.7.1.js"></script>
<script type="text/javascript">
    let pageIndex = 1;

    $(function () {
        sel(pageIndex);
    })

    function prevPage() {
        if (pageIndex > 1) {
            pageIndex = parseInt($("#page_index").val()) - 1;
            sel(pageIndex);
        } else {
            alert("没有更多数据");
        }

    }

    function nextPage() {
        if (pageIndex < parseInt($("#page_total").val())) {
            pageIndex = parseInt($("#page_index").val()) + 1;
            sel(pageIndex);
        } else {
            alert("没有更多数据");
        }
    }

    function goPage() {
        let wantGo = parseInt($("#page_index").val());
        let pageTotal = parseInt($("#page_total").val())
        if (wantGo < 1 || wantGo > pageTotal) {
            alert("没有更多数据");
            $("#page_index").val(pageIndex);
        } else {
            pageIndex = wantGo;
            sel(wantGo);
        }

    }

    function formatTimestamp(timestamp) {
        var date = new Date(timestamp);
        var formattedTime = date.toLocaleString(); // 使用默认的本地化时间格式
        return formattedTime;
    }


    function sel(pageIndex) {
        console.log(typeof pageIndex)
        let flowNo = $("#flowNo").val();
        let status = $("#status").val();
        let str = '';
        $.ajax({
            url: "${contextPath}/account/getList",
            type: "get",
            data: {
                pageIndex: pageIndex,
                pageSize: 5,
                flowNo: flowNo,
                status: status
            },
            dataType: 'json',
            success(res) {
                if (res.code === 0) {
                    let index = 0;
                    $("#page_index").val(pageIndex);
                    $("#page_total").val(res.total);
                    for (const d of res.data) {
                        let createTime = formatTimestamp(d.createTime);
                        let successTime = formatTimestamp(d.successTime);
                        let startInd=4;
                        let cardNo=d.cardNo.substring(0,startInd)+'********'+d.cardNo.substring(startInd+8);
                        let buttonHtml='';
                        if (d.status === 3) {
                            buttonHtml = `<button onclick="agree(`+d.id+`)">打款</button>
                          <button onclick="disAgree(`+d.id+`)">拒绝</button>
                          <button onclick="watch(`+d.id+`)">详情</button>`;
                        } else if (d.status === 1) {
                            buttonHtml = `<button>打款成功</button>
                          <button onclick="watch(`+d.id+`)">详情</button>`;
                        } else if (d.status === 2) {
                            buttonHtml = `<button>打款失败</button>
                          <button onclick="watch(`+d.id+`)">详情</button>`;
                        }
                        index++;
                        str += `<tr>
                        <td>` + index + `</td>
                        <td>` + d.flowNo + `</td>
                        <td>` + d.amount + `</td>
                        <td>` + createTime +`</td>
                        <td>` + successTime +`</td>
                        <td>` + d.userName + `</td>
                        <td>` + d.telNumber + `</td>
                        <td>` + d.bankName + `</td>
                        <td>` + cardNo + `</td>
                        <td>` + buttonHtml + `</td>
                        </tr>`;
                        $("#tw").html(str);
                        $("#flowNo").val(flowNo);
                        $("#status").val(status)
                    }
                } else {

                }
            }
        })
    }
    function agree(id){
        window.location.href="${contextPath}/account/edit/"+id+'?op=agree';
    }
    function disAgree(id){
        window.location.href="${contextPath}/account/edit/"+id+'?op=disAgree';
    }
    function watch(id){
        window.location.href="${contextPath}/account/edit/"+id+'?op=watch';
    }
</script>
</html>
